<%@ include file="/WEB-INF/views/include.jsp"%>
<html>
<head>
	<link rel="stylesheet" type="text/css" href="<c:url value="/css/ui/jquery.ui.datepicker.css"/>" />
	<link rel="stylesheet" type="text/css" href="<c:url value="/css/ui/jquery.ui.theme.css"/>" />
	<link rel="stylesheet" type="text/css" href="<c:url value="/css/ui/jquery.ui.core.css"/>" />
	<title>Create user</title>
</head>
<body>
<div id="wrapper">
		<div id="content">
        <div id="box">
            <form:form method="post" action="create-user" commandName="user">
              <fieldset id="personal">
                <legend>PERSONAL INFORMATION</legend>
                <div class="clearfix">
               		<form:label path="username">User Name</form:label>
               		<div class="input">
        				<form:input path="username"></form:input><form:errors path="username" cssClass="errors"/>
        			</div>
        		</div>
        		<div class="clearfix">
	                <form:label path="firstName">First Name</form:label>
	                <div class="input">
	                	<form:input path="firstName"></form:input><form:errors path="firstName" cssClass="errors"/>
	                </div>
                </div>
                <div class="clearfix">
	                <form:label path="lastName">Last Name</form:label>
	                <div class="input">
	        			<form:input path="lastName"></form:input><form:errors path="lastName" cssClass="errors"/>
	        		</div>
	        	</div>
	        	<div class="clearfix">
	             	<form:label path="email">Email</form:label>
	             	<div class="input">
	       				<form:input path="email"></form:input><form:errors path="email" cssClass="errors"/>
	    			</div>   			
		   		</div>	
	       		<div class="clearfix">
	                <form:label path="password">Password</form:label>
	                <div class="input">
	      				<form:password path="password"></form:password><form:errors path="password" cssClass="errors"/>
	      			</div>
      			</div>
      			<div class="clearfix">
	                <form:label path="birthday">Birthday</form:label>
	                <div class="input">
	       				<form:input path="birthday" id="datepicker"></form:input><form:errors path="birthday" cssClass="errors"/>
	       			</div>
                </div>
              </fieldset>
              <fieldset id="address">
                <legend>Address</legend>
                <div class="clearfix">
	                <form:label path="street">Street address :</form:label>
	                <div class="input">
	        			<form:input path="street"></form:input><form:errors path="street" cssClass="errors"/>
	        		</div>
                </div>
                <div class="clearfix">
	                <form:label path="city">City :</form:label>
	                <div class="input">
	        			<form:input path="city"></form:input><form:errors path="city" cssClass="errors"/>
	        		</div>
	        	</div>	
	        	<div class="clearfix">	
	                <form:label path="country">Country :</form:label>
	                <div class="input">
	        			<form:input path="country"></form:input><form:errors path="country" cssClass="errors"/>
	        		</div>
				</div>
				<div class="clearfix">
	                <form:label path="state">State/Province :</form:label>
	                <div class="input">
	        			<form:input path="state"></form:input><form:errors path="state" cssClass="errors"/>
	        		</div>
	        	</div>
                <div class="clearfix">
	                <form:label path="telephone">Telephone :</form:label>
	                <div class="input">
	        			<form:input path="telephone"></form:input><form:errors path="telephone" cssClass="errors"/>
	        		</div>
	        	</div>
              </fieldset>
              <div align="center" style="padding: 14px 19px;" class="well">
	              <input id="button1" type="submit" value="Submit" class="btn primary"/> 
	              <input id="button2" type="reset" class="btn success"/>
              </div>
           	</form:form>
        </div>
    </div>
</div>
<script type="text/javascript">
	$(document).ready(function() {
		jQuery("#datepicker").datepicker({
				changeMonth: true,
				changeYear: true
			});
	  });
</script>
</body>
</html>